<template>
  <div class="page">
    <!-- 顶部栏 -->
    <Base-Navbar title="活动排行榜" left-arrow></Base-Navbar>

    <div class="container">
      <!-- Tab -->
      <div class="mb-10">
        <Base-Tab v-model:index="tabIndex"></Base-Tab>
      </div>

      <div class="fz-13">
        <div class="box opacity cl-success mb-10">
          <div class="ta-center mb-10">
            <span>奖池状态：</span>
            <span>开启</span>
          </div>

          <div class="flex flex-rb">
            <div>
              <span>全网业绩：</span>
              <span>19999</span>
            </div>

            <div>
              <span>奖池结束倒计时：</span>
              <span>100/时</span>
            </div>
          </div>
        </div>

        <div class="table box opacity mb-10">
          <div class="table__th">
            <div class="table__td">排名</div>
            <div class="table__td">用户</div>
            <div class="table__td">总业绩</div>
            <div class="table__td">奖金</div>
          </div>

          <div class="table__tr" v-for="(v, i) in 5" :key="i">
            <div class="table__td">1</div>
            <div class="table__td">白色风车</div>
            <div class="table__td">800</div>
            <div class="table__td cl-success">999</div>
          </div>
        </div>

        <div class="title cl-error ta-center mb-10">排行榜规则</div>

        <div class="fz-12">
          为了鼓励合伙人等级用户的业绩表现，我们特别推出每日排名奖励活动。<br />
          该活动将统计每日已上代理等级用户的直推与间推业绩总额，<br />
          并根据排名情况给予相应的奖励，<br />
          具体规则如下：<br /><br />

          活动时间：每日凌晨2点至12点。<br />
          活动范围：已上合伙人等级用户。<br />
          活动开启规则：全网直推与间推业绩达到1万，即开启本次活动。<br />
          活动奖池总金额：1w 奖励金额<br />
          第1名：奖励3000<br />
          第2至10名：每位奖励500<br />
          第11至20名：每位奖励250<br /><br />

          奖励发放：排名奖励将于每日凌晨1点发放至用户的数字钱包中，<br />
          每位用户每日只能获得一次排名奖励，<br />
          排名奖励不可重复叠加。奖池金额将根据活动开启规则而定。<br />
        </div>
      </div>
    </div>
  </div>
</template>

<script setup>
import { ref } from 'vue'

import selects from 'js/selects'

const tabIndex = ref(0)
</script>

<style lang="scss" scoped></style>
